<template>
    <div class="own">
        <div class="img_div">
            <img class="own_img" src="@/img/head.jpg"/>
            <div>
                {{user.username}}
            </div>
        </div>
        <div class="own_info">
          <el-descriptions direction="vertical" :column="2" border>
            <el-descriptions-item label="用户ID" :span="2">{{user.identityId}}</el-descriptions-item>
            <el-descriptions-item label="手机号" :span="2">{{user.phone}}</el-descriptions-item>
            <el-descriptions-item label="email" :span="2">{{user.email}}</el-descriptions-item>
            <el-descriptions-item label="备注">
              <el-tag size="small">学生</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="qq">{{user.qq}}</el-descriptions-item>
          </el-descriptions>
        </div>
    </div>
</template>

<script>

export default {
  name: "Home",
  components: {

  },
  mounted() {
    var that = this
    this.$axios({
      method: "GET",
      url: "http://81.70.192.34:8088/getNowUserInfo",
    }).then(res => {
      that.user = res.data.data
      console.log(that.user)
    }).catch((error) => {
      console.error(error);
    });
  },
  data() {
    return {
      user: {
        email: '',
        username: '',
        qq: '',
        phone: '',
        identityId: '',
      }
    }
  }
};
</script>

<style scoped>
    .own{

    }

    .own_img{
        margin-top: 5%;
        height: 96px;
        width: 96px;
        background-color: aqua;
        border-radius: 48px;
    }

    .own_info{
      height: 29vh;
    }
    .el-descriptions__body{
      height: 29vh;
    }
</style>

